<template>
    <div class="carousel">
        <van-swipe :autoplay="3000" lazy-render>
            <van-swipe-item v-for="(image, index) in data?.images" :key="index">
                <img class="img-box" :src="image?.img" />
            </van-swipe-item>
        </van-swipe>
    </div>
</template>

<script setup name="carousel">

const props = defineProps({
    carouselList: {
        type: Array,
        default: () => {
            return [];
        },
    },
});
const data = reactive({
    images: props?.carouselList,
});
</script>
<style lang="less">
.carousel {
    height: 150px;

    .van-swipe {
        height: 150px;
    }

    .img-box {
        width: 100%;
        height: 100%;
    }
}
</style>